import { componentSizes } from 'element-plus';
import { createRouter, createWebHistory } from 'vue-router'
import Layout from '@/layout/index.vue';
import NotFound from '@/views/404/404.vue'
import Home from '@/views/Home/index.vue';
import Archive from '@/views/archives/index.vue'
import Categories from '@/views/categories/index.vue'
import Tags from '@/views/tags/index.vue'
import Article from '@/views/article/index.vue'
import Photos from '@/views/photos/index.vue'
import Messages from '@/views/messages/index.vue'
import About from '@/views/about/index.vue'

// import NotFound from '@/views/404/404.vue'

const routes = [
  {
    path: '/',
    component: Layout,
    meta: {
      title: 'Candice',
      loading: true
    },
    children: [
      {
        path: "/",
        name: "Home",
        component: Home,
        meta: {
          title: '首页',
          transition: 'fade',
          icon: 'fas fa-home',
          loading: true
        }
      },
      {
        path: '/archive',
        name: 'Archive',
        component: Archive,
        meta: {
          transition: 'fade',
          title: '归档 - Candice\'s Blog',
          icon: 'fas fa-archive'
        }
      },
      {
        path: '/categories',
        name: 'Categories',
        component: Categories,
        meta: {
          transition: 'fade',
          title: "分类 - Candice\'s Blog",
          icon: 'fas fa-folder'
        }
      },
      {
        path: '/tags',
        name: 'Tags',
        component: Tags,
        meta: {
          transition: 'fade',
          title: '标签 - Candice\'s Blog',
          icon: 'fas fa-tags'
        }
      },
      {
        path: '/moments',
        name: 'Moments',
        component: () => import('@/views/moments/index.vue'),
        meta: {
          title: '说说 - Candice\'s Blog',
          icon: 'fas fa-comment-dots'
        }
      },
      {
        path: '/post/:id',
        name: 'Post',
        component: Article,
        props: true,
        meta: {
          hidden: true
        }
      },
      {
        path: '/hotSearch',
        name: 'HotSearch',
        component: () => import(/* webpackPrefetch: true */ '@/views/hotSearch/index.vue'),
        meta: {
          transition: 'fade',
          title: '热搜 - Candice\'s Blog',
          icon: 'fas fa-fire'
        }
      },
      {
        path: '/resources',
        name: 'Resources',
        component: () => import('@/views/resources/index.vue'),
        meta: {
          title: '资源',
          icon: 'fas fa-cloud-download-alt'

        }
      },
      {
        path: '/photos',
        name: 'Photos',
        component: Photos,
        meta: {
            transition: 'fade',
            title: '相册 - Candice\'s Blog',
            icon: 'fas fa-images'
        }
      },
      {
        path: '/photos/:id',
        name: 'PhotoDetail',
        component: () => import('@/views/photos/detail.vue'),
        meta: {
            transition: 'fade',
            title: '相册详情 - Candice\'s Blog',
            icon: 'fas fa-images',
            hidden: true
        }
      },
      {
        path: '/user/profile',
        name: 'Profile',
        component: () => import(/* webpackPrefetch: true */ '@/views/profile/index.vue'),
        meta: {
          title: '个人主页 - 拾壹博客',
          icon: 'fas fa-user',
          hidden: true
        }
      },
      {
        path: '/messages',
        name: 'Messages',
        component: Messages,
        meta: { 
          transition: 'fade',
          title: '留言板 - 拾壹博客',
          icon: 'fas fa-comments'
        }
      },
      {
        path: '/about',
        name: 'About',
        component: About,
        meta: { 
          transition: 'fade',
          title: '关于本站 - 拾壹博客',
          icon: 'fas fa-info-circle'
        }
      },
      

      {
        path: '/login',
        name: 'Login',
        component: () => import('@/views/Login/index.vue'),
        meta: {
          title: '登录',
          hidden: true,
          fullscreen: true
        }
      },
      {
        path: '/notifications',
        name: 'Notifications',
        component: () => import('@/views/notifications/index.vue'),
        meta: {
          title: '消息通知',
          requiresAuth: true,
          hidden: true
        }
      },
      {
        path: '/:pathMatch(.*)*',
        name: 'NotFound',
        component: NotFound,
        meta: {
          hidden: true
        }
      },
    ]
  }
]

const router = createRouter({
  history: createWebHistory(),
  routes,
  scrollBehavior(to, from, savedPosition) {
    return { x: 0, y: 0 }
  }
})

//   router.beforeEach((to, from, next) => {
//     if (to.meta.title) {
//       document.title = to.meta.title
//     }
//     // 关闭搜索框
//     next()
//   })

export default router